<template>
  <div class="myaddress">
    <div class="tit">
      消息中心
      <span>ニュースセンター</span>
    </div>
    <ul>
      <li>
        <div class="time">
          2018-07-19 09:41    
        </div>
        <div class="box">
          <span>积分到账啦</span>
          <p>6积分到账啦！攒积分可以兑商品折扣哦，仅限手机贝拍网使用哦</p>
          <div class="active"></div>
        </div>
        
      </li>
      <li>
        <div class="time">
          2018-07-19 09:41    
        </div>
        <div class="box">
          <span>积分到账啦</span>
          <p>6积分到账啦！攒积分可以兑商品折扣哦，仅限手机贝拍网使用哦</p>
          <div class="active"></div>
        </div>
        
      </li>
    </ul>
  </div>
</template>

<script>
import { MessageBox } from "mint-ui"
export default {

  data () {
    return {
      
    }
  },

  methods: {
    
  },

  created () {
  }
}
</script>

<style lang='less' scoped>
:before,:after{
  height:0 !important;
}
.myaddress{
  ul{
    list-style: none;
    padding: 0;
    .time{
      font-size: 12px;
      color: #999999;
      letter-spacing: 0;
      line-height: 35px;
      text-align: center;

    }
    li{
      margin-bottom: 20px;
      .box{
        width:100%;
        background: #FFFFFF;
        border: 1px solid #E7E7E7;
        box-shadow: 1px 8px 18px 0 rgba(0,0,0,0.03);
        border-radius: 15px;
        padding: 20px 20px;
        position: relative;
        p{
          margin-top: 10px;
        }
        div{
          width:7px;
          height:7px;
          border-radius:7px;
          background: #eee;
          position: absolute;
          top:17px;
          right:20px;
        }
        div.active{
          background: #F73A4C;
        }
      }
    }
  }
}
</style>
